<!DOCTYPE html>
<html>
    
<head>
    <meta charset="utf-8">
    
    <title>2020年GitHub 上那些优秀Android开源库 | ApocalypseBlog</title>
    <canvas id="header_canvas"style="position:absolute;bottom:0"></canvas> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    

    

    

    

    
<link rel="stylesheet" href="/dist/build.css?v=1.14.0.css">

    <script src="/javascripts/bubble.js"></script>
    <script>
        window.isPost = true
        window.aomori = {
            
            
        }
        window.aomori_logo_typed_animated = false
        window.aomori_search_algolia = false

    </script>
<script>
    ((window.gitter = {}).chat = {}).options = {
      room: 'ApocalypseBlog/Apocalypse'
    };
  </script>
  <script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer></script>
<meta name="generator" content="Hexo 5.3.0"></head>
<!--DaoVoice服务http://blog.daovoice.io/-->

    <script>(function (i, s, o, g, r, a, m) {
        i['DaoVoiceObject'] = r;
        i[r] = i[r] ||
          function () {
            (i[r].q = i[r].q || []).push(arguments);
          };
        i[r].l = 1 * new Date();
        a = s.createElement(o);
        m = s.getElementsByTagName(o)[0];
        a.async = 1;
        a.src = g;
        a.charset = 'utf-8';
        m.parentNode.insertBefore(a, m);
      })(window, document, 'script', ('https:' === document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/b00f5052.js", 'daovoice');
      daovoice('init', {
        app_id: "b00f5052",
      });
      daovoice('update');
    </script>
  
<body>

    <div class="container">
    <header class="header">
        <div class="header-type">
            
            <div class="header-type-inner">
                
                    <a class="header-type-title" href="/">ApocalypseBlog</a>
                
    
                
            </div>
        </div>
        <div class="header-menu">
            <div class="header-menu-inner">
                
            </div>
            <div class="header-menu-social">
                
            </div>
        </div>

        <div class="header-menu-mobile">
            <div class="header-menu-mobile-inner" id="mobile-menu-open">
                <i class="icon icon-menu"></i>
            </div>
        </div>
    </header>

    <div class="header-menu-mobile-menu">
        <div class="header-menu-mobile-menu-bg"></div>
        <div class="header-menu-mobile-menu-wrap">
            <div class="header-menu-mobile-menu-inner">
                <div class="header-menu-mobile-menu-close" id="mobile-menu-close">
                    <i class="icon icon-cross"></i>
                </div>
                <div class="header-menu-mobile-menu-list">
                    
                </div>
            </div>
        </div>
    </div>

</div>

    <div class="container">
        <div class="main">
            <section class="inner">
                <section class="inner-main">
                    <div class="post">
    <article id="post-ckk6o6avq000s7kny48n28ki0" class="article article-type-post" itemscope
    itemprop="blogPost">

    <div class="article-inner">

        
          
        
        
        

        
        <header class="article-header">
            
  
    <h1 class="article-title" itemprop="name">
      2020年GitHub 上那些优秀Android开源库
    </h1>
  

        </header>
        

        <div class="article-more-info article-more-info-post hairline">

            <div class="article-date">
  <time datetime="2020-06-13T17:59:27.000Z" itemprop="datePublished">2020-06-14</time>
</div>

            

            

            

        </div>

        <div class="article-entry post-inner-html hairline" itemprop="articleBody">
            <p>2020年有哪些优秀的开源库呢？本期就为大家带精选的10个，排名不分先后。</p>
<a id="more"></a>

<h3 id="No1-LiquidSwipe"><a href="#No1-LiquidSwipe" class="headerlink" title="No1. LiquidSwipe"></a>No1. LiquidSwipe</h3><p>这是一个很棒的ViewPager库，它在浏览ViewPager的不同页面时，显示波浪的滑动动画，效果非常炫酷。该库的USP是触摸交互的。这意味着在视图中显示类似液体的显示过渡时，应考虑触摸事件。</p>
<h5 id="1-1如何使用呢？"><a href="#1-1如何使用呢？" class="headerlink" title="1.1如何使用呢？"></a>1.1如何使用呢？</h5><p>导入以下Gradle依赖项:</p>
<pre><code>implementation &#39;com.github.Chrisvin:LiquidSwipe:1.3&#39;
</code></pre>
<p>然后将<code>LiquidSwipeLayout</code>添加为保存fragment布局的容器的根布局：</p>
<pre><code>&lt;androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
    android:layout_width=&quot;match_parent&quot;
    android:layout_height=&quot;match_parent&quot;&gt;

    &lt;com.jem.liquidswipe.LiquidSwipeViewPager
        android:id=&quot;@+id/viewpager&quot;
        android:layout_width=&quot;match_parent&quot;
        android:layout_height=&quot;match_parent&quot;/&gt;

&lt;/androidx.constraintlayout.widget.ConstraintLayout&gt;
</code></pre>
<h5 id="1-2-效果图"><a href="#1-2-效果图" class="headerlink" title="1.2 效果图"></a>1.2 效果图</h5><table>
<thead>
<tr>
<th align="left">效果1</th>
<th align="left">效果2</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd596bc8a6?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd611cbcb0?imageslim" alt="img"></td>
</tr>
</tbody></table>
<p>更多详细使用方法请看Github: <a target="_blank" rel="noopener" href="https://github.com/Chrisvin/LiquidSwipe">github.com/Chrisvin/Li…</a></p>
<h3 id="No2-Flourish"><a href="#No2-Flourish" class="headerlink" title="No2. Flourish"></a>No2. Flourish</h3><p><code>Flourish</code>提供了一个炫酷的方式来显示或者隐藏一个布局，实现方式也很简单，就是对View或者布局进行了包装，通过构建者模式来提供api给上层调用。就像使用dialog一样，调用<code>show</code>和<code>dissmiss</code>方法来显示和隐藏。此外，通过这些类，我们还可以自定义动画（正常，加速，反弹），或为布局方向设置我们自己的起点（左上，右下等）。</p>
<h5 id="2-1-如何使用？"><a href="#2-1-如何使用？" class="headerlink" title="2.1 如何使用？"></a>2.1 如何使用？</h5><p>在build.gradle 中添加如下依赖：</p>
<pre><code>dependencies &#123;
    implementation &quot;com.github.skydoves:flourish:1.0.0&quot;
&#125;
</code></pre>
<p>然后在代码中，构建布局：</p>
<pre><code>Flourish flourish = new Flourish.Builder(parentLayout)
    // sets the flourish layout for showing and dismissing on the parent layout.
    .setFlourishLayout(R.layout.layout_flourish_main)
    // sets the flourishing animation for showing and dismissing.
    .setFlourishAnimation(FlourishAnimation.BOUNCE)
    // sets the orientation of the starting point.
    .setFlourishOrientation(FlourishOrientation.TOP_LEFT)
    // sets a flourishListener for listening changes.
    .setFlourishListener(flourishListener)
    // sets the flourish layout should be showed on start. 
    .setIsShowedOnStart(false)
    // sets the duration of the flourishing.
    .setDuration(800L)
    .build();
</code></pre>
<p>还提供有更简介的DSL:</p>
<pre><code>val myFlourish = createFlourish(parentLayout) &#123;
  setFlourishLayout(R.layout.layout_flourish_main)
  setFlourishAnimation(FlourishAnimation.ACCELERATE)
  setFlourishOrientation(FlourishOrientation.TOP_RIGHT)
  setIsShowedOnStart(true)
  setFlourishListener &#123;  &#125;
&#125;
</code></pre>
<h5 id="2-2-效果图"><a href="#2-2-效果图" class="headerlink" title="2.2  效果图"></a>2.2  效果图</h5><table>
<thead>
<tr>
<th align="left">效果1</th>
<th align="left">效果2</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd598c788c?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd65deef71?imageslim" alt="img"></td>
</tr>
</tbody></table>
<p>更多详细使用请看Github：<a target="_blank" rel="noopener" href="https://github.com/skydoves/Flourish">github.com/skydoves/Fl…</a></p>
<h3 id="No3-AestheticDialogs"><a href="#No3-AestheticDialogs" class="headerlink" title="No3. AestheticDialogs"></a>No3. AestheticDialogs</h3><p>这是一个美观而时尚的AlterDialog库，目前可支持六种不同的对话框,如：</p>
<ul>
<li>Flash Dialog</li>
<li>Connectify Dialog</li>
<li>Toaster Dialog</li>
<li>Emotion Dialog</li>
<li>Drake Dialog</li>
<li>Emoji Dialog 并且啊，还提供了暗黑模式的适配。</li>
</ul>
<h5 id="3-1-如何使用？"><a href="#3-1-如何使用？" class="headerlink" title="3.1 如何使用？"></a>3.1 如何使用？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
 ...
 implementation &#39;com.github.gabriel-TheCode:AestheticDialogs:1.1.0&#39;
&#125;
</code></pre>
<p>代码中，显示不同种类的对话框则调用对应的方法就好</p>
<p>Flash:</p>
<pre><code>AestheticDialog.showFlashDialog(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showFlashDialog(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);
</code></pre>
<p>Connectify:</p>
<pre><code>AestheticDialog.showConnectify(this,&quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showConnectify(this, &quot;Your message&quot;, AestheticDialog.ERROR);

 /// Dark Theme
 AestheticDialog.showConnectifyDark(this,&quot;Your message&quot;,AestheticDialog.SUCCESS);
 AestheticDialog.showConnectifyDark(this, &quot;Your message&quot;, AestheticDialog.ERROR);
</code></pre>
<p>Toaster:</p>
<pre><code> AestheticDialog.showToaster(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);
AestheticDialog.showToaster(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showToaster(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.WARNING);
 AestheticDialog.showToaster(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.INFO);

 /// Dark Theme
 AestheticDialog.showToasterDark(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);
AestheticDialog.showToasterDark(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showToasterDark(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.WARNING);
 AestheticDialog.showToasterDark(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.INFO);
</code></pre>
<p>Drake :</p>
<pre><code> AestheticDialog.showDrake(this, AestheticDialog.SUCCESS);
AestheticDialog.showDrake(this, AestheticDialog.ERROR);
</code></pre>
<p>Emoji :</p>
<pre><code> AestheticDialog.showEmoji(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showEmoji(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);

/// Dark Theme
 AestheticDialog.showEmojiDark(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showEmojiDark(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);
</code></pre>
<p>Emotion :</p>
<pre><code> AestheticDialog.showEmotion(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
AestheticDialog.showEmotion(this, &quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);
</code></pre>
<p>Rainbow :</p>
<pre><code> AestheticDialog.showRainbow(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.SUCCESS);
 AestheticDialog.showRainbow(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.ERROR);
 AestheticDialog.showRainbow(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.WARNING);
AestheticDialog.showRainbow(this,&quot;Your dialog Title&quot;, &quot;Your message&quot;, AestheticDialog.INFO);
</code></pre>
<h5 id="3-2-效果如下"><a href="#3-2-效果如下" class="headerlink" title="3.2 效果如下"></a>3.2 效果如下</h5><table>
<thead>
<tr>
<th align="left">Flash Dialog</th>
<th align="left">Connectify Dialog</th>
<th align="left">Toaster Dialog</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd6162084c?imageslim" alt="d1.gif"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd9aecbe0a?imageslim" alt="d2.gif"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fd65e67426?imageslim" alt="d3.gif"></td>
</tr>
</tbody></table>
<table>
<thead>
<tr>
<th align="left">Emotion Dialog</th>
<th align="left">Drake Dialog</th>
<th align="left">Emoji Dialog</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fda6337612?imageslim" alt="d4.gif"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fda6511772?imageslim" alt="d5.gif"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fda8cf1381?imageslim" alt="d6.gif"></td>
</tr>
</tbody></table>
<p>更多详情使用方法请看Github：<a target="_blank" rel="noopener" href="https://github.com/gabriel-TheCode/AestheticDialogs">github.com/gabriel-The…</a></p>
<h3 id="N4-EasyReveal"><a href="#N4-EasyReveal" class="headerlink" title="N4. EasyReveal"></a>N4. EasyReveal</h3><p>从名字就知道，这是一个提供<code>reveal</code>动画效果的库，它的厉害之处在于可以提供不同尺寸、不同形状的reveal动画，并且还可以在定义它在屏幕任意位置开始和结束动画。</p>
<h5 id="4-1-如何使用？"><a href="#4-1-如何使用？" class="headerlink" title="4.1 如何使用？"></a>4.1 如何使用？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
 ...
 implementation &#39;com.github.Chrisvin:EasyReveal:1.2&#39;
&#125;
</code></pre>
<p>然后，xml中，需要添加显示或者隐藏动画的View应该包裹在<code>EasyRevealLinearLayout</code>中：</p>
<pre><code>&lt;com.jem.easyreveal.layouts.EasyRevealLinearLayout
    ...
    app:clipPathProvider=&quot;star&quot; // possible values: circular, linear, random_line, star, sweep &amp; wave
    app:revealAnimationDuration=&quot;2000&quot;
    app:hideAnimationDuration=&quot;1500&quot; &gt;

    &lt;!-- The views to be revealed/hidden go here --&gt;

&lt;/com.jem.easyreveal.layouts.EasyRevealLinearLayout&gt;
&lt;!-- Similarly for com.jem.easyreveal.layouts.EasyRevealConstraintLayout &amp; com.jem.easyreveal.layouts.EasyRevealFrameLayout --&gt;
</code></pre>
<p>也可以在代码中添加：</p>
<pre><code>val revealLayout = EasyRevealLinearLayout(this)
// Set the ClipPathProvider that is used to clip the view for reveal animation
revealLayout.clipPathProvider = StarClipPathProvider(numberOfPoints = 6)
// Set the duration taken for reveal animation
revealLayout.revealAnimationDuration = 1500
// Set the duration taken for hide animation
revealLayout.hideAnimationDuration = 2000
// Set listener to get updates during reveal/hide animation
revealLayout.onUpdateListener = object: RevealLayout.OnUpdateListener &#123;
    override fun onUpdate(percent: Float) &#123;
        Toast.makeText(this@MainActivity, &quot;Revealed percent: $percent&quot;, Toast.LENGTH_SHORT).show()
    &#125;
&#125;
// Start reveal animation
revealLayout.reveal()
// Start hide animation
revealLayout.hide()
</code></pre>
<h5 id="4-2效果图"><a href="#4-2效果图" class="headerlink" title="4.2效果图"></a>4.2效果图</h5><table>
<thead>
<tr>
<th align="left">Emotion Dialog</th>
<th align="left">Drake Dialog</th>
<th align="left">Emoji Dialog</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fdaf742389?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fdb834525b?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fdcdb85e38?imageslim" alt="img"></td>
</tr>
<tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fdd5c42d60?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fde299e5f8?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fdecbac3a3?imageslim" alt="img"></td>
</tr>
</tbody></table>
<p>更多详细使用信息请看Github： <a target="_blank" rel="noopener" href="https://github.com/Chrisvin/EasyReveal">github.com/Chrisvin/Ea…</a></p>
<h3 id="No5-Android-ColorX"><a href="#No5-Android-ColorX" class="headerlink" title="No5. Android ColorX"></a>No5. Android ColorX</h3><p><code>Android ColorX</code> 以Kotlin 扩展函数的形式提供了一些重要的获取颜色的方法。 通过提供不同颜色格式（RGB，HSV，CYMK等）的转换功能，它使开发变得更加轻松。该库的USP具有以下功能：</p>
<ul>
<li>颜色的不同阴影和色调。</li>
<li>较深和较浅的阴影。</li>
<li>颜色的补码</li>
</ul>
<h5 id="5-1-如何使用？"><a href="#5-1-如何使用？" class="headerlink" title="5.1 如何使用？"></a>5.1 如何使用？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
    implementation &#39;me.jorgecastillo:androidcolorx:0.2.0&#39;
&#125;
</code></pre>
<p>在代码中，一系列的转换方法：</p>
<pre><code>val color = Color.parseColor(&quot;#e91e63&quot;)

val rgb = color.asRgb()
val argb = color.asArgb()
val hex = color.asHex()
val hsl = color.asHsl()
val hsla = color.asHsla()
val hsv = color.asHsv()
val cmyk = color.asCmyk()

val colorHsl = HSLColor(hue = 210f, saturation = 0.5f, lightness = 0.5f)

val colorInt = colorHsl.asColorInt()
val rgb = colorHsl.asRgb()
val argb = colorHsl.asArgb()
val hex = colorHsl.asHex()
val cmyk = colorHsl.asCmyk()
val hsla = colorHsl.asHsla()
val hsv = colorHsl.asHsv()
</code></pre>
<h5 id="5-2-效果图"><a href="#5-2-效果图" class="headerlink" title="5.2 效果图"></a>5.2 效果图</h5><p><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fdf42d10d3?imageslim" alt="img"></p>
<p>更多详细使用信息请看Github：<a target="_blank" rel="noopener" href="https://github.com/JorgeCastilloPrz/AndroidColorX">github.com/JorgeCastil…</a></p>
<h3 id="No6-AnimatedBottomBar"><a href="#No6-AnimatedBottomBar" class="headerlink" title="No6. AnimatedBottomBar"></a>No6. AnimatedBottomBar</h3><p>这是一个带动画的底部导航栏库。它使你可以以编程方式以及通过XML添加和删除选项卡。此外，我们可以轻松地从BottomBar拦截选项卡。限制访问应用程序导航中的高级区域时，“拦截”标签非常有用。流畅的动画提供了许多自定义选项，从动画插值器到设置波纹效果。</p>
<h5 id="6-1-如何使用？"><a href="#6-1-如何使用？" class="headerlink" title="6.1 如何使用？"></a>6.1 如何使用？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
  implementation &#39;nl.joery.animatedbottombar:library:1.0.8&#39;
&#125;
</code></pre>
<p>在xml文件中添加<code>AnimatedBottomBar</code>和自定义属性</p>
<pre><code>&lt;nl.joery.animatedbottombar.AnimatedBottomBar
    android:id=&quot;@+id/bottom_bar&quot;
    android:background=&quot;#FFF&quot;
    android:layout_width=&quot;match_parent&quot;
    android:layout_height=&quot;wrap_content&quot;
    app:abb_selectedTabType=&quot;text&quot;
    app:abb_indicatorAppearance=&quot;round&quot;
    app:abb_indicatorMargin=&quot;16dp&quot;
    app:abb_indicatorHeight=&quot;4dp&quot;
    app:abb_tabs=&quot;@menu/tabs&quot;
    app:abb_selectedIndex=&quot;1&quot; /&gt;
</code></pre>
<p>在<code>res/menu</code>目录下定义<code>tabs.xml</code>文件：</p>
<pre><code>&lt;menu xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;&gt;
    &lt;item
        android:id=&quot;@+id/tab_home&quot;
        android:icon=&quot;@drawable/home&quot;
        android:title=&quot;@string/home&quot; /&gt;
    &lt;item
        android:id=&quot;@+id/tab_alarm&quot;
        android:icon=&quot;@drawable/alarm&quot;
        android:title=&quot;@string/alarm&quot; /&gt;
    &lt;item
        android:id=&quot;@+id/tab_bread&quot;
        android:icon=&quot;@drawable/bread&quot;
        android:title=&quot;@string/bread&quot; /&gt;
    &lt;item
        android:id=&quot;@+id/tab_cart&quot;
        android:icon=&quot;@drawable/cart&quot;
        android:title=&quot;@string/cart&quot; /&gt;
&lt;/menu&gt;
</code></pre>
<p>最后，代码中添加tab</p>
<pre><code>// Creating a tab by passing values
val bottomBarTab1 = AnimatedBottomBar.createTab(drawable, &quot;Tab 1&quot;)

// Creating a tab by passing resources
val bottomBarTab2 = AnimatedBottomBar.createTab(R.drawable.ic_home, R.string.tab_2, R.id.tab_home)
</code></pre>
<h5 id="6-2-效果图"><a href="#6-2-效果图" class="headerlink" title="6.2 效果图"></a>6.2 效果图</h5><table>
<thead>
<tr>
<th align="left">tab1</th>
<th align="left">tab2</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe11cdef3a?imageslim" alt="tab1.gif"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe19a34bf0?imageslim" alt="tab2.gif"></td>
</tr>
</tbody></table>
<p>详情信息请看Github: <a target="_blank" rel="noopener" href="https://github.com/Droppers/AnimatedBottomBar">github.com/Droppers/An…</a></p>
<h3 id="No7-RateBottomSheet"><a href="#No7-RateBottomSheet" class="headerlink" title="No7. RateBottomSheet"></a>No7. RateBottomSheet</h3><p>有时候，为了推广我们的应用，我们需要让用户跳转到应用商店为我们的APP打分，传统的对话框用户体验很不好，而本库则是用BottomSheet来进行提示，它位于底部缩略区域，用户体验很好。</p>
<h5 id="7-1-如何使用呢？"><a href="#7-1-如何使用呢？" class="headerlink" title="7.1 如何使用呢？"></a>7.1 如何使用呢？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
implementation &#39;com.mikhaellopez:ratebottomsheet:1.1.0&#39;
&#125;
</code></pre>
<p>然后修改默认的string资源文件来改变显示文案：</p>
<pre><code>&lt;resources&gt;
    &lt;string name=&quot;rate_popup_ask_title&quot;&gt;Like this App?&lt;/string&gt;
    &lt;string name=&quot;rate_popup_ask_message&quot;&gt;Do you like using this application?&lt;/string&gt;
    &lt;string name=&quot;rate_popup_ask_ok&quot;&gt;Yes I do&lt;/string&gt;
    &lt;string name=&quot;rate_popup_ask_no&quot;&gt;Not really&lt;/string&gt;

    &lt;string name=&quot;rate_popup_title&quot;&gt;Rate this app&lt;/string&gt;
    &lt;string name=&quot;rate_popup_message&quot;&gt;Would you mind taking a moment to rate it? It won\&#39;t take more than a minute. Thanks for your support!&lt;/string&gt;
    &lt;string name=&quot;rate_popup_ok&quot;&gt;Rate it now&lt;/string&gt;
    &lt;string name=&quot;rate_popup_later&quot;&gt;Remind me later&lt;/string&gt;
    &lt;string name=&quot;rate_popup_no&quot;&gt;No, thanks&lt;/string&gt;
&lt;/resources&gt;
</code></pre>
<p>代码中使用：</p>
<pre><code>RateBottomSheetManager(this)
    .setInstallDays(1) // 3 by default
    .setLaunchTimes(2) // 5 by default
    .setRemindInterval(1) // 2 by default
    .setShowAskBottomSheet(false) // True by default
    .setShowLaterButton(false) // True by default
    .setShowCloseButtonIcon(false) // True by default
    .monitor()

// Show bottom sheet if meets conditions
// With AppCompatActivity or Fragment
RateBottomSheet.showRateBottomSheetIfMeetsConditions(this)
</code></pre>
<h5 id="7-2-效果图"><a href="#7-2-效果图" class="headerlink" title="7.2 效果图"></a>7.2 效果图</h5><p><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe29028b1a?imageslim" alt="img"></p>
<p>更多详情请看Github:<a target="_blank" rel="noopener" href="https://github.com/lopspower/RateBottomSheet">github.com/lopspower/R…</a></p>
<h3 id="No8-TransformationLayout"><a href="#No8-TransformationLayout" class="headerlink" title="No8. TransformationLayout"></a>No8. TransformationLayout</h3><p>这是一个用于Activity或者Fragment 以及View切换的过渡动画库，效果非常炫，它使用Material Design的运动系统过渡模式来创建变形动画。该库提供了用于绑定目标视图，设置淡入淡出和路径运动方向以及许多其他自定义选项的属性。</p>
<h5 id="8-1-如何使用？"><a href="#8-1-如何使用？" class="headerlink" title="8.1 如何使用？"></a>8.1 如何使用？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
    implementation &quot;com.github.skydoves:transformationlayout:1.0.4&quot;
&#125;
</code></pre>
<p>然后，需要将我们需要添加过渡动画的View包裹到 <code>TransformationLayout</code>:</p>
<pre><code>&lt;com.skydoves.transformationlayout.TransformationLayout
  android:layout_width=&quot;wrap_content&quot;
  android:layout_height=&quot;wrap_content&quot;
  app:transformation_targetView=&quot;@+id/my_cardView&quot; // sets a target view.
  app:transformation_duration=&quot;450&quot; // sets a duration of the transformation.
  app:transformation_direction=&quot;auto&quot; // auto, entering, returning
  app:transformation_fadeMode=&quot;in&quot; // in, out, cross, through
  app:transformation_fitMode=&quot;auto&quot; // auto, height, width
  app:transformation_pathMode=&quot;arc&quot; // arc, linear
&gt;

   &lt;!-- other views --&gt;

&lt;/com.skydoves.transformationlayout.TransformationLayout&gt;
</code></pre>
<p>比如我们要将一个fab 过渡到一个card卡片，布局如下：</p>
<pre><code>&lt;com.skydoves.transformationlayout.TransformationLayout
    android:id=&quot;@+id/transformationLayout&quot;
    android:layout_width=&quot;wrap_content&quot;
    android:layout_height=&quot;wrap_content&quot;
    app:transformation_duration=&quot;550&quot;
    app:transformation_targetView=&quot;@+id/myCardView&quot;&gt;

  &lt;com.google.android.material.floatingactionbutton.FloatingActionButton
      android:id=&quot;@+id/fab&quot;
      android:layout_width=&quot;wrap_content&quot;
      android:layout_height=&quot;wrap_content&quot;
      android:backgroundTint=&quot;@color/colorPrimary&quot;
      android:src=&quot;@drawable/ic_write&quot;/&gt;
&lt;/com.skydoves.transformationlayout.TransformationLayout&gt;

&lt;com.google.android.material.card.MaterialCardView
    android:id=&quot;@+id/myCardView&quot;
    android:layout_width=&quot;240dp&quot;
    android:layout_height=&quot;312dp&quot;
    android:layout_marginLeft=&quot;30dp&quot;
    android:layout_marginTop=&quot;30dp&quot;
    app:cardBackgroundColor=&quot;@color/colorPrimary&quot; /&gt;
</code></pre>
<p><strong>重点来了，绑定视图</strong>，将一个<code>targetView</code>绑定到<code>TransformationLayout</code>有2种方式：</p>
<ul>
<li>通过在xml中指定属性：</li>
</ul>
<pre><code>app:transformation_targetView=&quot;@+id/myCardView&quot;
</code></pre>
<ul>
<li>在代码中绑定</li>
</ul>
<pre><code>transformationLayout.bindTargetView(myCardView)
</code></pre>
<p>当我们点击fab时，在监听器中调用<code>startTransform()</code>开始过渡动画，<code>finishTransform（）</code>开始结束动画。</p>
<pre><code>// start transformation when touching the fab.
fab.setOnClickListener &#123;
  transformationLayout.startTransform()
&#125;

// finish transformation when touching the myCardView.
myCardView.setOnClickListener &#123;
  transformationLayout.finishTransform()
&#125;
</code></pre>
<h5 id="8-2-效果图"><a href="#8-2-效果图" class="headerlink" title="8.2 效果图"></a>8.2 效果图</h5><p><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe31ffea34?imageslim" alt="img"></p>
<p>更多使用方式请看Github: <a target="_blank" rel="noopener" href="https://github.com/skydoves/TransformationLayout">github.com/skydoves/Tr…</a></p>
<h3 id="No9-Donut"><a href="#No9-Donut" class="headerlink" title="No9. Donut"></a>No9. Donut</h3><p>这个一个可以展示多个数据集的圆弧形控件，具有精细的颗粒控制、间隙功能、动画选项以及按比例缩放其值的功能。可以用于项目中的一些数据统计。</p>
<h5 id="9-1-如何使用？"><a href="#9-1-如何使用？" class="headerlink" title="9.1 如何使用？"></a>9.1 如何使用？</h5><p>在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
    implementation(&quot;app.futured.donut:library:$version&quot;)
&#125;
</code></pre>
<p>然后在布局文件中添加View:</p>
<pre><code>&lt;app.futured.donut.DonutProgressView
    android:id=&quot;@+id/donut_view&quot;
    android:layout_width=&quot;wrap_content&quot;
    android:layout_height=&quot;wrap_content&quot;
    app:donut_bgLineColor=&quot;@color/cloud&quot;
    app:donut_gapWidth=&quot;20&quot;
    app:donut_gapAngle=&quot;270&quot;
    app:donut_strokeWidth=&quot;16dp&quot;/&gt;
</code></pre>
<p>然后在代码中设置数据：</p>
<pre><code>val dataset1 = DonutDataset(
    name = &quot;dataset_1&quot;,
    color = Color.parseColor(&quot;#FB1D32&quot;),
    amount = 1f
)

val dataset2 = DonutDataset(
    name = &quot;dataset_2&quot;,
    color = Color.parseColor(&quot;#FFB98E&quot;),
    amount = 1f
)

donut_view.cap = 5f
donut_view.submitData(listOf(dataset1, dataset2))
</code></pre>
<h5 id="9-2-效果图"><a href="#9-2-效果图" class="headerlink" title="9.2  效果图"></a>9.2  效果图</h5><p><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe83c87b9a?imageslim" alt="img"></p>
<p>更多用法请看Github: <a target="_blank" rel="noopener" href="https://github.com/futuredapp/donut">github.com/futuredapp/…</a></p>
<h3 id="No10-CurveGraphView"><a href="#No10-CurveGraphView" class="headerlink" title="No10. CurveGraphView"></a>No10. CurveGraphView</h3><p><code>CurveGraphView</code> 是一个带有炫酷动画统计图表库，除了性能出色并具有许多样式选项之外，该库还支持单个平面内的多个线图。</p>
<p>多个折线图对于比较不同股票，共同基金，加密货币等的价格非常有用。</p>
<h5 id="10-1-如何使用？"><a href="#10-1-如何使用？" class="headerlink" title="10.1 如何使用？"></a>10.1 如何使用？</h5><p>1、在<code>build.gradle</code> 中添加如下依赖：</p>
<pre><code>dependencies &#123;
    implementation &#39;com.github.swapnil1104:CurveGraphView:&#123;current_lib_ver&#125;&#39;
&#125;
</code></pre>
<p>2、在xml文件中添加布局：</p>
<pre><code> &lt;com.broooapps.graphview.CurveGraphView
        android:id=&quot;@+id/cgv&quot;
        android:layout_width=&quot;0dp&quot;
        android:layout_height=&quot;250dp&quot;
        app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
        app:layout_constraintEnd_toEndOf=&quot;parent&quot;
        app:layout_constraintStart_toStartOf=&quot;parent&quot;
        app:layout_constraintTop_toTopOf=&quot;parent&quot; /&gt;
</code></pre>
<p>然后在代码中添加各种配置项</p>
<pre><code>curveGraphView = findViewById(R.id.cgv);

curveGraphView.configure(
        new CurveGraphConfig.Builder(this)
                .setAxisColor(R.color.Blue)                                             // Set X and Y axis line color stroke.
                .setIntervalDisplayCount(7)                                             // Set number of values to be displayed in X ax
                .setGuidelineCount(2)                                                   // Set number of background guidelines to be shown.
                .setGuidelineColor(R.color.GreenYellow)                                 // Set color of the visible guidelines.
                .setNoDataMsg(&quot; No Data &quot;)                                              // Message when no data is provided to the view.
                .setxAxisScaleTextColor(R.color.Black)                                  // Set X axis scale text color.
                .setyAxisScaleTextColor(R.color.Black)                                  // Set Y axis scale text color
                .build()
        ););
</code></pre>
<p>3、 提供数据集</p>
<pre><code>PointMap pointMap = new PointMap();
        pointMap.addPoint(0, 100);
        pointMap.addPoint(1, 500);
        pointMap.addPoint(5, 800);
        pointMap.addPoint(4, 600);
</code></pre>
<h5 id="10-2-效果图"><a href="#10-2-效果图" class="headerlink" title="10.2 效果图"></a>10.2 效果图</h5><table>
<thead>
<tr>
<th align="left">效果1</th>
<th align="left">效果2</th>
</tr>
</thead>
<tbody><tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe31f4c9ad?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe61166b90?imageslim" alt="img"></td>
</tr>
<tr>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe67f21c88?imageslim" alt="img"></td>
<td align="left"><img src="http://user-gold-cdn.xitu.io/2020/4/27/171b92fe80ec22ee?imageslim" alt="img"></td>
</tr>
</tbody></table>
<p>更多详细使用方式请看Github: <a target="_blank" rel="noopener" href="https://github.com/swapnil1104/CurveGraphView">github.com/swapnil1104…</a></p>

        </div>

    </div>

    

    

    

    

    

    
<nav class="article-nav">
  
    <a href="/2020/06/14/Kotlin%E5%AE%9E%E6%88%98-%E8%AF%AD%E6%B3%95%E7%B3%96/" id="article-nav-newer" class="article-nav-link-wrap">
      <div class="article-nav-caption">下一篇</div>
      <div class="article-nav-title">
        
          Kotlin实战 | 语法糖
        
      </div>
    </a>
  
  
    <a href="/2020/06/14/Androidx%20%E4%B8%8B%20Fragment%20%E6%87%92%E5%8A%A0%E8%BD%BD%E7%9A%84%E6%96%B0%E5%AE%9E%E7%8E%B0/" id="article-nav-older" class="article-nav-link-wrap">
      <div class="article-nav-caption">上一篇</div>
      <div class="article-nav-title">Androidx 下 Fragment 懒加载的新实现</div>
    </a>
  
</nav>


    <section class="share">
        <div class="share-title">分享</div>
        <a class="share-item" target="_blank"
            href="https://twitter.com/share?text=2020年GitHub 上那些优秀Android开源库 - ApocalypseBlog&url=http://example.com/2020/06/14/2020%E5%B9%B4GitHub-%E4%B8%8A%E9%82%A3%E4%BA%9B%E4%BC%98%E7%A7%80Android%E5%BC%80%E6%BA%90%E5%BA%93/">
            <box-icon type='logo' name='twitter'></box-icon>
        </a>
        <a class="share-item" target="_blank"
            href="https://www.facebook.com/sharer.php?title=2020年GitHub 上那些优秀Android开源库 - ApocalypseBlog&u=http://example.com/2020/06/14/2020%E5%B9%B4GitHub-%E4%B8%8A%E9%82%A3%E4%BA%9B%E4%BC%98%E7%A7%80Android%E5%BC%80%E6%BA%90%E5%BA%93/">
            <box-icon name='facebook-square' type='logo' ></box-icon>
        </a>
        <!-- <a class="share-item" target="_blank"
            href="https://service.weibo.com/share/share.php?title=2020年GitHub 上那些优秀Android开源库 - ApocalypseBlog&url=http://example.com/2020/06/14/2020%E5%B9%B4GitHub-%E4%B8%8A%E9%82%A3%E4%BA%9B%E4%BC%98%E7%A7%80Android%E5%BC%80%E6%BA%90%E5%BA%93/&pic=">
            <div class="n-icon n-icon-weibo"></div>
        </a> -->
    </section>

</article>









</div>
                </section>
            </section>

             
            <aside class="sidebar">
            
                
            </aside>
        </div>
    </div>

    <footer class="footer">
    <div class="footer-wave">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="#3c4859" fill-opacity="1" d="M0,160L60,181.3C120,203,240,245,360,240C480,235,600,181,720,186.7C840,192,960,256,1080,261.3C1200,267,1320,213,1380,186.7L1440,160L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"></path></svg>
    </div>

    <div class="footer-wrap">
        <div class="footer-inner"> 
            ApocalypseBlog &copy; 2021<br>
            Powered By Hexo · Theme By <a href="https://github.com/lh1me/hexo-theme-aomori" target="_blank">Aomori</a>
        </div>
    </div>

</footer>




<script src="/dist/build.js?1.14.0.js"></script>


<script src="/dist/custom.js?1.14.0.js"></script>









</body>

</html>